<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <script src="/layui/layui.js"></script>
    <script src="/echarts/echarts.js"></script>
    <script src="/echarts/chalk.js"></script>
</head>
<body style="background-color: rgb(57,61,73)">
<div id="myCount" style="width: 100%;height:540px;"></div>
</body>
<script>
    layui.use(['jquery'], function () {
        let $ = layui.jquery;
        $.ajax({
            url: "/getMyCount",
            type: "GET",
            dataType: "JSON",
            success: function (data) {
                let option;
                let myChart = echarts.init(document.getElementById('myCount'),'chalk');
                option = {
                    title: {
                        text: '报名人数统计',
                        subtext: '实时报名量'
                    },
                    legend: {},
                    tooltip: {},
                    dataset: {
                        source: data.data
                    },
                    xAxis: {type: 'category'},
                    yAxis: {},
                    // Declare several bar series, each will be mapped
                    // to a column of dataset.source by default.
                    series: [
                        {type: 'bar'},
                        {type: 'bar'},
                    ]
                };
                // 使用刚指定的配置项和数据显示图表。

                myChart.setOption(option);

            }
        })

    });

</script>
</html>